<template>
  <div id="Entry">
    <img src="../../assets/img/banner.jpg" alt="" class="c-banner"/>
    <h3 class="c-title">深圳市自卸车行业协会管理平台</h3>
    <ul class="c-entry">
      <li class="c-entry__item active-able" v-for="(item,key) in ENTRY_LIST" :key="key" @click="$pushRoute(item.path)">
        {{item.name}}
      </li>
    </ul>
  </div>

</template>

<script>
  import {ENTRY_LIST} from "@/config/const";

  export default {
    name: "Entry",
    data() {
      return {ENTRY_LIST}
    },
    methods: {},
    computed: {},
    onShow() {
    }
  }
</script>

<style scoped lang="scss">
  @import "../../assets/common";

  #Entry {
    .c-banner {
      width: 100%;
      height: 250px;
    }
    .c-title {
      text-align: center;
      margin: 22px 0;
      font-size: 20px;
      font-weight: bold;
    }
    .c-entry {
      @include flex-center;
      flex-direction: column;
      &__item {
        @include flex-center;
        background: #ffac90;
        color: white;
        font-weight: bold;
        font-size: 20px;
        width: 80%;
        height: 80px;
        border-radius: 6px;
        box-shadow: 0 5px 5px  -2px #ccc;
        &:not(:first-child) {
          margin-top: 16px;
        }
      }
    }
  }
</style>
